iT邦幫忙

2021 iThome 鐵人賽

DAY 26
0

Hello, 各位 iT邦幫忙 的粉絲們大家好~~~

本篇是 Re: 從零開始用 Xamarin 技術來複刻過去開發的一個 App: TopStore 系列文的 EP26。

在經過上上上一篇 EP23 與 上上一篇的 EP24 介紹後,應該已經知道如何透過 SQLite DB 來處理 App 中所要儲存的資料了。

不過,也是可能有人會覺得那在這之前的 MockData 裡的 People 假資料不就白費了?

恩...從認識開發的角度來看,若沒有 MockData 來協助引導開發的話,一開始就要搞 SQLite DB 與 SQLite.NET 的使用,恐怕就退卻了不少想要學習 App 開發的朋友吧。

不過,若是從展示與測試的角度來看,之前辛苦撰寫的 MockData 來建立的聯絡人資料,也其實並不全然沒用的,例如讓使用者在 App 一開始使用時,當作用來引導用戶使用 App 的範例資料,等用戶理解 App 的使用概念後,再請用戶切換到 SQLite DB 的操作開始自己建立資料...。

本 EP26 來介紹如何透過一些程式設計的技巧,來切換 MockData 與 SQLite DB 的資料運用在 App 當中吧!

那就開始囉~~~


首先,在 Services 資料夾當中設計一個 interface。
新增 IDataService 的 Interface 1

姑且稱之為 IDataService 好了。
新增 IDataService 的 Interface 2

新增好的 interface 原始樣貌。
新增 IDataService 的 Interface 2

接著再改些變化的地方。
修改 IDataService 的 Interface 1

設計 interface 當中的方法。
修改 IDataService 的 Interface 2

眼明的朋友應該已經發現,這些設計到 interface 當中的方法簽章,好像皆似曾相似?

沒錯...由於前面的篇章中在介紹使用 DbService 與 MockData 時,操作的方式皆極為相似,所以在這邊做了一個抽象化的設計 "IDataService" 來描述資料的存取。

接著來稍微調整一下 DbService 類別與其當中設計的方法。

首先,先讓 DbService 實作 IDataService
修改 DbService 1

再來補上 NewPerson 的方法,並且將之前設計修飾詞為 internal 的方法改為 public。
修改 DbService 2

完成 DbService 的修正。
修改 DbService 3

換調整 MockData 類別的設計,只是要調整的幅度比較多就是。

首先,先幫 MockData 的類別實作 IDataService
修改 MockData 1

接著把之前設計的 People 欄位替換成下一張圖片上的寫法。
修改 MockData 2-1

修改 MockData 2-2

當然因為這樣的修改,在 MockData 當中對 "P"eople 的方法操作都要改成 "p"eople 喔!

修改 GetPerson 與 NewPerson 的方法修飾詞。
修改 MockData 3-1

修改 EditPeople 的方法修飾詞外,並變更方法名稱為 SavePerson。
修改 MockData 3-2

增加一個 DeletePerson 的方法。
修改 MockData 3-3

再增加一個 GetPeople 的方法。
修改 MockData 3-4

MockData 修改到這樣就完全符合 IDataService 需實作的 Interface 設計了。

接著打開 App.xaml.cs 並且設計一個 IDataService 的 DataService 靜態欄位。
App 的 DataService 設計 1
App 的 DataService 設計 2

後面就找出這個專案本身,原本就有用到 DbService 處理到資料的部分,全部換成 App.DataService 來處理吧!

由於當初會操作到資料的部分,都根據 MVVM 的設計原則上大多都在 ViewModel 上,所以要找到當初有用到 DbService 處理資料的部分,應該也就是找當初設計 ViewModel 的類別程式。

PeoplePageViewModel 修改。
PeoplePageViewModel 修改 1
PeoplePageViewModel 修改 2

PeopleDetailPageViewModel 修改。
PeopleDetailPageViewModel 修改 1
PeopleDetailPageViewModel 修改 2

而有一個沒有在 ViewModel 使用到 DbService 資料的地方是,當初 PeoplePage 所覆寫的 OnAppearing 方法。

PeoplePage 的 OnAppearing 方法修改 1
PeoplePage 的 OnAppearing 方法修改 2

好了,再次回到 App.xmal.cs 這時候就可以有兩種資料來源的寫法。

若想用 MockData 的假資料,請這樣由 App 建構式賦予 DataService 資料。
App 的 DataService 設計 7-1

若想用 DbService 讓使用者自行編修資料,請這樣由 App 建構式賦予 DataService 資料。
App 的 DataService 設計 7-2

這篇 EP26 改完後有沒有發現當初設計的 MockData 並沒有浪費掉,而且還可以來做為 "展示/測試" 資料的使用呢?

好啦,本篇 EP26 就介紹到這邊,下篇見囉~~~

峇啦滴督!!!


上一篇
EP 25: Validation by Data Annotation Validators in TopStore App
下一篇
EP 27: MockData come back with UI design in TopStore App
系列文
Re: 從零開始用 Xamarin 技術來復刻過去開發的一個 App : TopStore32
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言